export default {
  componentUpdated(el, binding) {
    const scrollBox = el;
    const selectedItem = el.children[binding.value];
    const behavior = binding.modifiers.smooth ? 'smooth' : 'auto';
    if (!selectedItem) return;
    if (binding.arg === 'y') {
      const boxTop = scrollBox.getBoundingClientRect().top;
      const itemTop = selectedItem.getBoundingClientRect().top;
      const offsetY = itemTop - boxTop + selectedItem.offsetHeight / 2;
      const scrollY = offsetY - scrollBox.offsetHeight / 2;
      scrollBox.scrollBy({
        top: scrollY,
        behavior,
      });
    } else {
      const boxLeft = scrollBox.getBoundingClientRect().left;
      const itemLeft = selectedItem.getBoundingClientRect().left;
      const offsetX = itemLeft - boxLeft + selectedItem.offsetWidth / 2;
      const scrollX = offsetX - scrollBox.offsetWidth / 2;
      scrollBox.scrollBy({
        left: scrollX,
        behavior,
      });
    }
  },
};
